<template>
	<view>
		<view class="reg_wrapper">
			<view class="tx1">欢迎注册求职者会员</view>
			<view class="field_cell_group">
				<view class="field_cell">
					<label>
						<input class="reg_field" type="tel" placeholder="请输入手机号" autocomplete="off" v-model="mobile" />
					</label>
				</view>
				<view class="field_cell">
					<label>
						<input class="reg_field" type="number" placeholder="请输入验证码" autocomplete="off" v-model="code" />
					</label>
					<button class="reg_get_btn" @click="sendSms">
						{{ sendSmsBtnText }}
					</button>
				</view>
				<view class="field_cell">
					<label>
						<input class="reg_field" type="text" placeholder="账户密码" autocomplete="off" v-model="password"
							:password="true" />
					</label>
				</view>
				<view class="field_cell">
					<label>
						<input class="reg_field" type="text" placeholder="确认密码" autocomplete="off"
							v-model="repeatPassword" :password="true" />
					</label>
				</view>
			</view>

			<view class="btn_group">
				<view class="btn login_btn" @click="handleSubmit">注册求职者会员</view>
				<view class="btn login_reg" @click="handleClick()"> 已有账号？立即登录</view>
			</view>

			<LoginAgree ref="LoginAgree"></LoginAgree>
			<!-- <view class="bottom_agree">
        <view class="agree_content">
          <u-checkbox v-model="checked" icon-size="16px">
            我已阅读并同意
            <text class="link" @click.stop="showAgreement('agreement')">《用户协议》</text>
            和
            <text class="link" @click.stop="showAgreement('privacy')">《隐私政策》</text>
          </u-checkbox>
        </view>
      </view> -->
		</view>
		<u-popup v-model="showText" mode="right" :mask="false" width="100%" height="100%">
			<view class="text_content">
				<u-parse :html="showTextContent"></u-parse>
			</view>
		</u-popup>
		<Captcha ref="captcha"></Captcha>
		<u-top-tips ref="uTips"></u-top-tips>
	</view>
</template>

<script>
	import handlerHttpError from '@/utils/error'
	import http from '@/utils/http'
	import api from '@/api'
	import Captcha from '@/components/captcha/index'
	import {
		mapState
	} from 'vuex'
	import LoginAgree from "@/components/LoginAgree.vue"
	export default {
		name: 'RegPersonal',
		components: {
			Captcha,
			LoginAgree
		},
		data() {
			return {
				showTextTitle: '注册协议',
				showTextContent: '',
				showText: false,
				mobile: '',
				code: '',
				password: '',
				repeatPassword: '',
				checked: true,
				regularMobile: /^13[0-9]{9}$|14[0-9]{9}$|15[0-9]{9}$|18[0-9]{9}$|17[0-9]{9}$|16[0-9]{9}$|19[0-9]{9}$/
			}
		},
		computed: {
			...mapState({
				sendSmsBtnText: state => state.sendSmsBtnText
			})
		},
		created() {
			this.$store.commit('clearCountDownFun')
		},
		methods: {
			handleClick() {
				uni.redirectTo({
					url: '/member/Login?utype_alias=' + 'personal'
				})
			},
			showAgreement(alias) {
				this.showTextContent = ''
				this.showText = true
				this.showTextTitle = alias == 'agreement' ? '注册协议' : '隐私政策'
				http
					.get(api.agreement, {})
					.then(res => {
						if (parseInt(res.data.code) === 200) {
							this.showTextContent =
								alias == 'agreement' ? res.data.data.agreement : res.data.data.privacy
						} else {
							this.$refs.uTips.show({
								title: res.data.message,
								type: 'error'
							})
						}
					})
					.catch(() => {})
			},
			// 提交之前的验证
			handleSubmit() {
				if (!this.$refs.LoginAgree.checked) {
					this.$refs.uTips.show({
						title: '请同意用户协议和隐私政策',
						type: 'error'
					})
					return false
				}
				if (!this.mobile) {
					this.$refs.uTips.show({
						title: '请输入手机号',
						type: 'error'
					})
					return false
				}
				if (!this.regularMobile.test(this.mobile)) {
					this.$refs.uTips.show({
						title: '手机号格式不正确',
						type: 'error'
					})
					return false
				}
				if (!this.code) {
					this.$refs.uTips.show({
						title: '请输入验证码',
						type: 'error'
					})
					return false
				}
				if (!this.password) {
					this.$refs.uTips.show({
						title: '请输入密码',
						type: 'error'
					})
					return false
				}
				if (!this.repeatPassword) {
					this.$refs.uTips.show({
						title: '请再次确认密码',
						type: 'error'
					})
					return false
				}
				if (this.password !== this.repeatPassword) {
					this.$refs.uTips.show({
						title: '两次输入的密码不一致',
						type: 'error'
					})
					return false
				}
				let scene_uuid = uni.getStorageSync('scene_uuid');
				let postData = {
					mobile: this.mobile,
					code: this.code,
					password: this.password,
					scene_uuid: scene_uuid
				}
				http
					.post(api.reg_personal, postData)
					.then(res => {
						if (parseInt(res.data.code) === 200) {
							this.$refs.uTips.show({
								title: res.data.message,
								type: 'success'
							})
							this.$store.commit('clearCountDownFun')
							this.$store.commit('setLoginState', {
								whether: true,
								utype: res.data.data.utype,
								token: res.data.data.token,
								mobile: res.data.data.mobile,
								userIminfo: res.data.data.user_iminfo
							})
							uni.setStorageSync('loginInfo', {
								whether: true,
								utype: res.data.data.utype,
								token: res.data.data.token,
								mobile: res.data.data.mobile,
								userIminfo: res.data.data.user_iminfo
							});
							if (res.data.data.next_code != 200) {
								if (res.data.data.next_code == 50007) { //个人需要创建简历 -- 跳到个人中心其他操作再提示创建简历
									uni.setStorageSync('toCompleteCompanyInfo', false)
									uni.setStorageSync('toCompleteResume', true)
									uni.redirectTo({
										url: '/personal/PersonalIndex'
									})
								}
							}
						} else {
							this.$refs.uTips.show({
								title: res.data.message,
								type: 'error'
							})
						}
					})
					.catch(() => {})
			},
			// 发送验证码
			sendSms() {
				let _this = this
				if (this.$store.state.sendSmsBtnDisabled) {
					return false
				}
				if (!this.mobile) {
					this.$refs.uTips.show({
						title: '请输入手机号',
						type: 'error'
					})
					return false
				}
				if (!this.regularMobile.test(this.mobile)) {
					this.$refs.uTips.show({
						title: '手机号格式不正确',
						type: 'error'
					})
					return false
				}
				this.$refs.captcha.show(res => {
					this.$store
						.dispatch('sendSmsFun', {
							url: api.get_reg_code,
							mobile: this.mobile,
							type: 2,
							captcha: res
						})
						.then(response => {
							if (response.code === 200) {
								this.$refs.uTips.show({
									title: _this.$store.state.sendSmsMessage,
									type: 'success'
								})
							} else {
								this.$refs.uTips.show({
									title: _this.$store.state.sendSmsMessage,
									type: 'error'
								})
							}
						})
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.text_content {
		font-size: 28rpx;
		padding: 40rpx;
	}

	.reg_wrapper {
		margin: 0 42rpx;
	}

	.tx1 {
		padding: 110rpx 0 78rpx;
		font-size: 46rpx;
		color: #2A2A2A;
		font-weight: bold;
	}
</style>
